iT邦幫忙

2025 iThome 鐵人賽

DAY 20
0
Modern Web

從0到有做出一個商家網頁系列 第 20

Day20:學習呈現文件結構的HTML標籤

  • 分享至 

  • xImage
  •  

今天要學習呈現文件結構的HTML標籤

1.劃分頁首區域
<header></header>:在網頁內容區域(<body>~</body>裡面)加入<header>標籤,包圍LOGO與導覽列

2.劃分導覽列區域
<nav></nav>:此標籤用來標示網站的導覽列

3.劃分主要區域
<main></main>:只在網頁的主要內容區域使用一次

4.劃分貼文區域
<article></article>:使用於新聞網站或部落格的文章,通常會附上標題

5.劃分補充資料區域(側邊欄)
<side></side>:顯示即使省略也不會影響主要內容的補充資料,如廣告、相關連結、專欄等

6.劃分頁尾區域
<side></side>:源自「foot」這個單字,意思是最下面,通常包含與著作權、著作者有關的資料

7.劃分段落區域
<section></section>:包圍標題與緊跟在後面的段落,通常會附上標題(<h1><h6>)

8.標記貼文的發布時間
<time></time>:使用於時間具有重要意義的情況,如貼文的發佈時間等

要標記時間就會使用<time>標籤,為了說明時間,則要使用datetime屬性,請注意datetime屬性要用電腦可以讀取的格式來標記日期、時間

程式
<time datetime="3021-08=08T12:03">3021年8月8日12時3分</time>

請注意上述程式的各種格式,包括要在年、月、日之間加上-(連字號),要在時間後面加上:(冒號),連續輸入「日期」與「時間」時,要在中間輸入大寫字母T,這樣寫才能變成電腦可以讀取的格式,此外,也可以只寫年月、月日、時間等省略型

今天先到這邊明天再繼續!


上一篇
Day19:學習新的CSS語法和HTML語法
下一篇
Day21:學習其他用途的HTML標籤和CSS語法
系列文
從0到有做出一個商家網頁30
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言